<template>
  <h1>个人中心</h1>
  <div v-for="(weibo,i) in arr" style="width: 500px;margin: 0 auto;height: 40px;">
    <h3 style="float: left;margin: 0;line-height: 32px">{{ weibo.content }}</h3>
    <el-button type="danger" style="float: right" @click="del(weibo.id,i)">删除</el-button>
  </div>
</template>

<script setup>

import {ref, onMounted} from "vue";
import axios from "axios";
import {ElMessage} from "element-plus";
import router from "@/router";


const arr = ref([])
onMounted(() => {
  //先获取用户id
  let user = localStorage.user ? JSON.parse(localStorage.user) : null;
  axios.get('http://localhost:8080/v1/weibos?userId=' + user.id).then((response) => {
    if (response.data.code == 2002) {
      arr.value = response.data.data;
      if (arr.value.length == 0) {
        ElMessage.warning('快来发布你的第一条内容吧')
        router.push('/post')
      }
    }
  })
})

const del = (id,i)=>{
  if(confirm('您确定要删除此条微博')){
    axios.post('http://localhost:8080/v1/weibos/'+id+'/delete').then((response)=>{
      if(response.data.code==2002){
        ElMessage.success('删除成功');
        arr.value.splice(i,1);
        if(arr.value.length==0){
          ElMessage.warning('快来发布微博吧');
          router.push('/post');
        }
      }
    })
  }
}

</script>

<style scoped>

</style>